<template>
   <div>
    <el-form :inline="true" :model="query" label-width="130px" size="small">
      <!-- 申请商城账号查询 -->
      <el-form-item class="query-form-item">
        <el-input v-model="query.companyName" placeholder="品牌公司名称" prefix-icon="el-icon-search"  @keyup.enter.native="onSubmit" clearable></el-input>
      </el-form-item>
      <!-- 查询框 -->
      <el-form-item>
        <el-button type="primary" icon="el-icon-refresh" @click="onRest" size="small"></el-button>
        <el-button type="primary" icon="el-icon-search" @click="onSubmit">搜索</el-button>
        <el-button type="primary" icon="el-icon-add" @click="addForm">新增县级品牌公司</el-button>
        <el-button type="primary" icon="el-icon-add" @click="backForm">返回规则设置页面</el-button>
      </el-form-item>
    </el-form >
      <!-- table表单 -->
      <el-table  ref="singleTable" :data="tableData" v-loading="loading"   style="width: 100%">
        <el-table-column label="序号" type="index" align="center" width="50">  </el-table-column>
        <el-table-column prop="status" align="center" label="公司级别" >
          <template slot-scope="scope">
            <span v-if="scope.row.status==0" style="color:#4acf1e;">县级</span>
            <span v-else >--</span>
           </template>
        </el-table-column>
        <el-table-column prop="companyid" align="center" label="公司ID"  ></el-table-column>
        <el-table-column prop="companyname" align="center" label="品牌公司名称" >
         <template slot-scope="scope">
            <span v-if="scope.row.companyname !== null" style="color:#ffa659;">{{scope.row.companyname}}</span>
            <span v-else >无</span>
          </template>
        </el-table-column>
        <el-table-column prop="developrelationid" align="center" label="开发关系公司ID" ></el-table-column>
        <el-table-column prop="developrelationlevel" align="center" label="开发关公司级别" > 
         <template slot-scope="scope">
            <span v-if="scope.row.developrelationlevel == 1" style="color:#ffa659;">全球品牌</span>
            <span v-else-if="scope.row.developrelationlevel ==2" style="color:#4acf1e;">省级</span>
            <span v-else-if="scope.row.developrelationlevel ==3" style="color:#4acf1e;">市级</span>
            <span v-else-if="scope.row.developrelationlevel ==4" style="color:#4acf1e;">县级</span>
            <span v-else>无</span>
          </template>
        </el-table-column>
        <el-table-column prop="developrelationcompanyname"  align="center" label="开发关系公司名称" ></el-table-column>

         <el-table-column  align="center" label="操作"  > 
            <template slot-scope="scope">
              <el-button type="danger" @click="delate(scope.row)" size="small">删除</el-button>
            </template>
        </el-table-column>

        </el-table>

        <el-pagination class="pagination-container"  background  :page-size="query.pageSize"
        @size-change="handleSizeChange" @current-change="handleCurrentChange"  layout="total,sizes,prev, pager, next, jumper"
        :current-page="this.query.currentPage"
        :page-sizes="[10, 20, 30, 50]"
        :total="totalNumber"></el-pagination>
    </div>
    
</template>
<script>
import {postList,delCountyCompany} from "../../api/incubationrules/index.js"
export default {
    data() {
      return {
        tableData: [],//列表集合
        query: {
          currentPage: 1,
          pageSize: 10  ,
          companyName:"",//公司名称
          ActivityId:""
        },
        totalNumber: 0,
        loading: false,
      }
    },
    methods: {
      // 列表数据获取
      postList(){
         this.loading = true;
        postList(this.query)
        .then(data=>{
            console.log(data) 
            if (data.code != 0) {
                this.$message.error(response.message);
                this.loading = false;
                return false;
            }
            this.tableData=data.data.list || []
            this.totalNumber = data.data.totalNumber || 0;
            // console.log(this.tableData)
            setTimeout(() => {
             this.loading = false;
            }, 0.3 * 1000);
          })
          .catch(err=>{
             this.loading = false;
              this.tableData =[]
          })
      },
      
      //新增信息跳转页面
      addForm(){
        this.$router.push({path:"addBusList"})
      },
      //删除

      delate(val){
        
        if (val.activityid) {
            this.$confirm("确认要删除吗?", "提示", {
                type: "warning"
            }).then(()=>{
                 this.loading = true;
                 let data ={
                    ActivityId:val.activityid
                }
                delCountyCompany(data)
                .then(res=>{
                console.log(res)
                if (res.code != 0) {
                        this.$message.error(res.message);
                        this.loading = false;
                        return false;
                    }

                    this.$message.success(res.message);
                    this.postList()
                }) 
                .catch(() => {
                    this.loading = false;
                });
            })
             .catch(() => {});
       
       } 
      },
      backForm(){
        this.$router.push({path:"incubation"})
      },
      //刷新
      onRest() { 
            this.query = {
                currentPage: 1,
                pageSize: 10  ,
                companyName:"" 
            };
            
           this.postList()
        },
     
      //查询
      onSubmit() {
        this.query.currentPage = 1;
        this.postList()
        // console.log('submit!');
      }, 
      handleCurrentChange(val) {
            this.query.currentPage = val;
            this.postList()
        },
        handleSizeChange(val) {
            this.query.pageSize = val;
            this.postList()
        },
    },
   
    mounted(){
      
    },
   created(){
     this.postList()
   }

  }
</script>